$(document).ready(function(){
	$("body").on("click",".form-header-info",function(){
		if($(".jdiag-header-info-container").length == 0 ){
			var form_json = $("body").data();
			var dialog_header_info
			=	'<div class="jdiag-header-info-container">'+
					'<div class="header-info-header">'+
						'<h3 class="fl-margin-bottom"><i class="icon-save"></i> Header Information</h3>'+
						'<div class="hr"></div>'+
					'</div>'+
					'<div class="header-info-body">'+
						//'<label><input type="checkbox" class="enable-header-info"/> Enable header information</label>'+
						'<label><input type="checkbox" class="header-info-check-all css-checkbox" id="header-info-check-all"/><label for="header-info-check-all" class="css-label"></label> Check all</label>'+
						'<div class="hr"></div><br/><br/>'+
						'<div id="form-field-list-container" style="position: relative; margin: 0px auto; padding: 0px; width: 100%; overflow: hidden;height: 300px;">'+
                        	'<div class="content-dialog form-field-list-names" style="height: auto;">'+

                        	'</div>'+
                        '</div>'+
					'</div>'+
					'<div class="header-info-footer">'+
						'<div class="fields">'+
							'<div class="label_basic"></div>'+
							'<div class="input_position" style="margin-top:5px;text-align:right;">'+
								'<input type="button" class="btn-blueBtn save-header-info" value="Save" style="margin-right:8px;">'+
								'<input type="button" class="btn-basicBtn cancel-header-info" value="Cancel">'+
							'</div>'+
						'</div>'+
					'</div>'+
				'</div>';

			var newDialog = new jDialog(dialog_header_info, '', '', '', '', function(){
	        
	        });
	        newDialog.themeDialog("modal2");

	        //INITIALIZING PERFECT SCROLLBAR ... 
	        $("#form-field-list-container").perfectScrollbar();

	        //ADDING LIST OF HEADER INFO ON THE FORM
			var append_location_list_field = $("#popup_container").find(".form-field-list-names").eq(0);
			$(".formbuilder_ws .setObject").each(function(eqindex){
				var self = $(this);
				if(//SKIP THE NON INPUT FIELDS
					self.attr("data-type") == "labelOnly" ||
					self.attr("data-type") == "createLine" ||
					self.attr("data-type") == "tab-panel" ||
					self.attr("data-type") == "table" ||
					self.attr("data-type") == "imageOnly" ||
					self.attr("data-type") == "listNames"
				){
					return true;
				}
				var data_obj_id = self.attr("data-object-id");
				var this_obj_label = self.find("#lbl_"+data_obj_id).text();
				var field_name = self.find(".getFields_"+data_obj_id).attr("name");
				var append_list_info = $(
					'<label header-info-object-id="'+data_obj_id+'">'+
						'<input type="checkbox" class="header-info-field" data-name="'+field_name+'" value="'+field_name+'"/> <span class="header-info-label">'+this_obj_label+'</span>'+
					'</label><br/>'
				);
				append_location_list_field.append(append_list_info);
			});
			$("#form-field-list-container").perfectScrollbar("update");

			FormsHeaderInfo.init();

			//RESTORING SAVED VALUES
			if(typeof form_json.collected_data_header_info != "undefined"){
				if(typeof form_json.collected_data_header_info.listedchoice != "undefined"){ //THIS TYPEOF CONDITION ABLES US TO SECURE THE EXISTENCE OF THE SPECIFIC DATA BASED ON THE CONDITION
					for(var ctr = 0 ; ctr < form_json.collected_data_header_info.listedchoice.length ; ctr++){
						var saved_datas = form_json.collected_data_header_info.listedchoice[ctr];
						if( //I JUST DID THIS KIND OF CONDITION TO SECURE THE DATA INEGRITY OR SECURE THE ACCURATENESS OF RESTORING THE DATA OF A SAVED STATE
							// $(".header-info-field").eq(saved_datas.checkbox_index).length >= 1 &&
							// $(".header-info-field").eq(saved_datas.checkbox_index).closest("[header-info-object-id]").attr("header-info-object-id") == saved_datas.data_obj_id &&
							// $(".header-info-field").eq(saved_datas.checkbox_index).closest("[header-info-object-id]").children(".header-info-label").text() == saved_datas.field_label
							$("label[header-info-object-id='"+saved_datas.data_obj_id+"']").eq(0).length >= 1 &&
							$("label[header-info-object-id='"+saved_datas.data_obj_id+"']").eq(0).find(".header-info-label").text() == saved_datas.field_label
						){
							//$(".header-info-field").eq(saved_datas.checkbox_index).prop("checked",true); //RESTORED
							$("label[header-info-object-id='"+saved_datas.data_obj_id+"']").eq(0).find(".header-info-field[type='checkbox']").eq(0).prop("checked",true); //RESTORED
						}
					}
					var total_checkbox = $(".form-field-list-names").find(".header-info-field").length;
	        		var total_checked = $(".form-field-list-names").find(".header-info-field:checked").length;
	        		if(total_checkbox == total_checked){
	        			$(".header-info-check-all").prop("checked",true);
	        		}else{
	        			$(".header-info-check-all").prop("checked",false);
	        		}
				}
			}
			
	        //CHECK ALL CHECKBOX
	        $(".header-info-check-all").on({
	        	"click":function(){
	        		var is_checked = $(this).is(":checked");
	        		var self = $(this);
	        		if(is_checked){
	        			self.closest(".header-info-body").find(".header-info-field").prop("checked",true);
	        		}else{
	        			self.closest(".header-info-body").find(".header-info-field").prop("checked",false);
	        		}
	        	}
	        });

	        //CANCEL BUTTON
	        $(".cancel-header-info").on({
				"click":function(){
					$(this).closest("#popup_container").remove();
					$("#popup_overlay").remove();
				}
			});

			//SAVING BUTTON
			$(".save-header-info").on({
				"click":function(){
					var this_json = $("body").data();
					var self = $(this);
					collect_checked_header_info = {
						listedchoice:[]
						//,enable_header_info:$(".enable-header-info").is(":checked")
					};
					
					listed_choices_items = self.closest("#popup_container").find("label[header-info-object-id]");
					console.log(listed_choices_items)
					listed_choices_items.each(function(eqindex){
						var self = $(this);
						if(self.children(".header-info-field[type='checkbox']").prop("checked") == true){
							collect_checked_header_info.listedchoice.push({
								//"checkbox_index":eqindex,
								"data_obj_id":self.attr("header-info-object-id"),
								"field_label":self.find(".header-info-label").text(),
								"field_name":self.find("[data-name]").val()
							});
						}
					});

					this_json.collected_data_header_info = collect_checked_header_info;
					this_json.headerInfoType = $(".headerInfoType:checked").val();
					// console.log("ETTTOOO NA");
					// console.log(this_json);
					/*$(this).closest("#popup_container").fadeOut(function(){
						$(this).remove();
					})
					$("#popup_overlay").fadeOut(function(){
						$(this).remove();
					});*/
					$('.fl-closeDialog').click();
				}
			});

			//CHECK INDIVIDUAL CHECKBOX
			$(".header-info-field").on({
	        	"click":function(){
	        		var is_checked = $(this).is(":checked");
	        		var total_checkbox = $(".form-field-list-names").find(".header-info-field").length;
	        		var total_checked = $(".form-field-list-names").find(".header-info-field:checked").length;
	        		if(total_checkbox == total_checked){
	        			$(".header-info-check-all").prop("checked",true);
	        		}else{
	        			$(".header-info-check-all").prop("checked",false);
	        		}
	        	}
	        })
		}
	});
});

//Header info
FormsHeaderInfo = {
	init : function(){
		// return; 
		this.setFormHeaderTypeHtml();
		this.setDefaultHeaderInFormFieldsHeader();

		this.setFormHeaderType();
		this.setFormHeaderTypeFields();
		
		/******RULES FOR CUSTOM HEADER INFO*/
		/*	For old and new forms*/
		//	- if the form do not have any header info, it means that the field in request will be the default fields(track no, requestor, status, date create);
		/*	For old forms*/
		//  - if the form do not have any settings for default or specific view, the view shall retain to its original view
	},
	setFormHeaderTypeHtml : function(){
		var htmlPrepend = '<div class="fields" style="margin-left:10px;">'+
						'<div class="label_below2"></div>'+
						'<div class="input_position" style="margin-top:5px;">'+
							'<label style="font-weight: bold;font-size: 10px;">'+
							'<input type="radio" name="headerInfoType" class="headerInfoType css-checkbox" value="0" style="margin-right:8px;" id="headerInfoType">'+
								'<label for="headerInfoType" class="css-label"></label>'+
								'Default Header'+
							'</label>'+
						'</div>'+
					'</div>'+
					'<div class="fields" style="margin-left:10px;">'+
						'<div class="label_basic"></div>'+
						'<div class="input_position" style="margin-top:5px;">'+
							'<label style="font-weight: bold;font-size: 10px;">'+
							'<input type="radio" name="headerInfoType" class="headerInfoType css-checkbox" value="1" style="margin-right:8px;" id="headerInfoType">'+
								'<label for="headerInfoType" class="css-label"></label>'+
								'Specific Header'+
							'</label>'+
						'</div>'+
					'</div>';


		$(".header-info-body").before(htmlPrepend);
		$(".header-info-body").css({
			"margin-left": "20px",
			"margin-top": "20px",
		})
	},
	setDefaultHeaderInFormFieldsHeader : function(){
		var append_location_list_field = $("#popup_container").find(".form-field-list-names");
		// var defaultFields = ['Tracking Number','Requestor','Status','Date Created']
		var defaultFields = [
			{
				"fieldLabel":"Date Created",
				"fieldName":"DateCreated"
			},
			{
				"fieldLabel":"Status",
				"fieldName":"Status"
			},
			{
				"fieldLabel":"Requestor",
				"fieldName":"Requestor"
			},
			{
				"fieldLabel":"Tracking Number",
				"fieldName":"TrackNo"
			}
		];

		for(var j in defaultFields){
			var append_list_info = $(
				'<label header-info-object-id="'+defaultFields[j]['fieldName']+'">'+
					'<input type="checkbox" class="header-info-field css-checkbox" data-name="'+defaultFields[j]['fieldName']+'" value="'+defaultFields[j]['fieldName']+'" id="'+defaultFields[j]['fieldName']+'"/><label for="'+defaultFields[j]['fieldName']+'" class="css-label"></label> <span class="header-info-label">'+defaultFields[j]['fieldLabel']+'</span>'+
				'</label><br/><br/>'
			);
			append_location_list_field.prepend(append_list_info);
		}
		console.log(append_location_list_field)
	},
	setFormHeaderType : function(){
		var self = this;
		var formId = $("#FormId").val();
		var form_json = $("body").data();
		var headerInfoType = form_json['headerInfoType'];

		//Form is not yet created
		if(typeof headerInfoType === undefined){
			self.setheaderTypeFieldsPropDisable(0)
			return;
		}


		var form_json = $("body").data();
		var headerInfoType = form_json['headerInfoType'];
		


		
		if(typeof headerInfoType=="undefined"){
			if(typeof form_json.collected_data_header_info!="undefined"){
				if(form_json.collected_data_header_info.listedchoice.length==0){ // no header info has been set
					self.setheaderTypeFieldsPropDisable(0)
				}else{
					self.setheaderTypeFieldsPropDisable(1)
				}
			}else{
				self.setheaderTypeFieldsPropDisable(0)
			}
		}else{
			self.setheaderTypeFieldsPropDisable(headerInfoType)
		}
	},
	setFormHeaderTypeFields : function(){
		var self = this;
		$(".headerInfoType").change(function(){
			var headerInfoType = $(this).val();
			self.setheaderTypeFieldsPropDisable(headerInfoType);
			
		})
	},

	setheaderTypeFieldsPropDisable : function(headerInfoType){
		if(headerInfoType==1){
			$(".header-info-field, .header-info-check-all").attr("disabled",false);
		}else{
			$(".header-info-field, .header-info-check-all").attr("disabled","disabled");
		}
		$(".headerInfoType[value='"+ headerInfoType +"']").attr("checked","checked");
	},
}